﻿<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Dreamer Blog - 后台管理系统</title> 
    <!-- bootstrap 3.0.2 -->
    <link href="/resource/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <!-- font Awesome -->
    <link href="/resource/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <!-- Ionicons -->
    <link href="/resource/css/ionicons.min.css" rel="stylesheet" type="text/css" />
    <!-- iCheck for checkboxes and radio inputs -->
    <link href="/resource/css/iCheck/all.css" rel="stylesheet" type="text/css" />
    <!-- Theme style -->
    <link href="/resource/css/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="/resource/js/jQueryMessage/css/message.skin.css" />
</head>

<body>
	<div class="row">
	    <div class="col-md-12">
	    	<h1 class="panel-heading">搜索结果</h1>
	        <!--breadcrumbs start -->
	        <ul class="breadcrumb">
				<li><a href="/admin/dashboard/toIndex"><i class="fa fa-home"></i> 首页</a></li>
				<li class="active">搜索结果</li>
			</ul>
	        <!--breadcrumbs end -->
	    </div>
	</div>
	<div class="row">
		<div class="col-lg-12">
			<section class="panel">
				<div class="panel-body">
	                <form id="form1" th:action="@{/admin/search/doSearch}" method="post">
	                	<div class="row">
	                		<div class="col-sm-12 col-md-6 col-lg-4">
								<div class="form-group">
									<label for="keywords">搜索关键字：</label>
									<input id="keywords" name="entity['keywords']" type="text" th:value="${keywords}" class="form-control" placeholder="输入关键字进行搜索" />
								</div>
							</div>
							<div class="col-sm-12 col-md-6 col-lg-4">
								<div class="form-group">
									<button id="go" type="submit" class="btn btn-info" style="margin-top: 25px;">保存</button>
								</div>
							</div>
						</div>
					</form>
	            </div>
			    <div class="panel-body table-responsive">
					<table class="table table-hover">
						<thead>
							<tr>
								<th style="width:50px;">选择</th>
								<th>文章标题</th>
								<th>所属栏目</th>
								<th>发布时间</th>
								<th>浏览量</th>
								<th>权重</th>
								<th>发布状态</th>
								<th style="width:150px;">操作</th>
							</tr>
						</thead>
						<tbody>
							<tr th:each="article : ${archives.list}">
								<td><input type="checkbox" class="flat-grey list-child" th:value="${article.id}"/></td>
								<td><a href="#" th:text="${article.title}"></a></td>
								<td th:text="${article.categoryCnName}"></td>
								<td th:text="${#dates.format(article.createTime, 'yyyy-MM-dd')}"></td>
								<td th:text="${article.clicks}"></td>
								<td th:text="${article.weight}"></td>
								<td><span th:text="${article.status}=='1'?'已发布':'未发布'" th:class="${article.status}=='1'?'label label-success':'label label-danger'">否</span></td>
								<td>
									<a target="_blank" th:href="'/article/' + ${article.id}" class="btn btn-xs btn-warning">预览</a>
									<span>&nbsp;|&nbsp;</span>
									<a href="javascript:void(0)" class="btn btn-xs btn-success copyArticleIdBtn" th:aid="${article.id}" th:onclick="javascript:copyArticleId(this.getAttribute('aid'))">复制文章ID</a>
								</td>
							</tr>
							<tr th:if="${#lists.isEmpty(archives.list)}">
								<td colspan="8" align="center">无数据</td>
							</tr>
						</tbody>
					</table>
			    </div>
			    <div class="panel-footer bg-white text-right">
                     <ul class="pagination">
                         <li><a th:href="@{/admin/search/doSearch(pageNum=${archives.navigateFirstPage},pageSize=${archives.pageSize},entity[keywords]=${keywords})}" title="首页" th:class="${archives.isFirstPage} ? 'paginationNotAllowed' : ''">«</a></li>
                         <li><a th:href="@{/admin/search/doSearch(pageNum=${archives.prePage},pageSize=${archives.pageSize},entity[keywords]=${keywords})}" title="上一页" th:if="${archives.hasPreviousPage}">‹</a></li>
                         <li th:each="pageinfo : ${archives.navigatepageNums}"><a th:href="@{/admin/search/doSearch(pageNum=${pageinfo},pageSize=${archives.pageSize},entity[keywords]=${keywords})}" th:class="${pageinfo == archives.pageNum} ? 'paginationActive' : ''" th:text="${pageinfo}"></a></li>
                         <li><a th:href="@{/admin/search/doSearch(pageNum=${archives.nextPage},pageSize=${archives.pageSize},entity[keywords]=${keywords})}" title="下一页" th:if="${archives.hasNextPage}">›</a></li>
                         <li><a th:href="@{/admin/search/doSearch(pageNum=${archives.navigateLastPage},pageSize=${archives.pageSize},entity[keywords]=${keywords})}" title="未页" th:class="${archives.isLastPage} ? 'paginationNotAllowed' : ''">»</a></li>
                     </ul>
                 </div>
			</section>
		</div>
	</div>
	<!-- jQuery 2.0.2 -->
	<script src="/resource/js/jquery.min.js" type="text/javascript"></script>
	<!-- jQuery UI 1.10.3 -->
	<script src="/resource/js/jquery-ui-1.10.3.min.js" type="text/javascript"></script>
	<!-- Bootstrap -->
	<script src="/resource/js/bootstrap.min.js" type="text/javascript"></script>
	<!-- iCheck -->
    <script src="/resource/js/plugins/iCheck/icheck.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="/resource/js/jQueryMessage/js/jquery.plugin.message.js"></script>
	<script src="/resource/js/clipboard.min.js" type="text/javascript"></script>
	<script type="text/javascript">
		window.onload = function(){
			renderCheckBox();
		}
		
		function renderCheckBox(){
			$('input').on('ifChecked', function(event) {
			    $(this).parents('li').addClass("task-done");
			    console.log('ok');
			});
			$('input').on('ifUnchecked', function(event) {
			    $(this).parents('li').removeClass("task-done");
			    console.log('not');
			});
			
			$('input[type="checkbox"].flat-grey, input[type="radio"].flat-grey').iCheck({
			    checkboxClass: 'icheckbox_flat-grey',
			    radioClass: 'iradio_flat-grey'
			});
		}
		
		function copyArticleId(id){
			var content = id;
			var clipboard = new Clipboard('.copyArticleIdBtn',{
				text: function() {
					return content;
				}
			});
			clipboard.on('success', function(e) {
				$("body").MessageBox({
					type: 'success',
					message: '复制成功！',
					timeout:3000,
					callbak:null
				});
			});
		
			clipboard.on('error', function(e) {
				$("body").MessageBox({
					type: 'error',
					message: '复制失败！',
					timeout:3000,
					callbak:null
				});
			});
		}
	</script>
</body>
</html>
